<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>内容编辑系统</title>
    <link rel="stylesheet" href=" __static__/fontawesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="__static__/layui/css/layui.css" />
    <link rel="stylesheet" href="__static__/admin/admin.css" />
    <script src="__static__/js/jquery.min.js"></script>
</head>
<body class="layui-layout-body">
    <div class="layui-layout layui-layout-admin">
        <div class="layui-header">
            <a class="layui-logo" href="javascript:window.location.reload();">后台管理</a>
            <nav class="layui-layout-left">
                <ul class="layui-inline layui-nav layui-nav-switch" style="padding: 0;">
                    <!--左侧菜单块的展开与折叠-->
                    <li class="layui-nav-item">
                        <a href="javascript: void(0);" class="hideMenu" title="展开或折叠">
                            <i class="layui-icon layui-icon-shrink-right"></i>
                        </a>
                    </li>
                    <li class="layui-nav-item">
                        <a href="javascript: window.mainfrm.location.reload();" title="重载框架内页"><i class="layui-icon layui-icon-refresh"></i></a>
                    </li>
                </ul>
            </nav>
            <nav class="layui-layout-right">
                <ul class="layui-nav">
                    <li class="layui-nav-item layui-hide-xs" style="display:none;">
                        <a class="clearCache">
                            <i class="layui-icon layui-icon-delete"></i>
                            <cite>清除缓存</cite>
                            <span class="layui-badge-dot"></span>
                        </a>
                    </li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">
                            <cite class="userName">{$curruser.username}</cite>
                        </a>
                        <dl class="layui-nav-child">
                            <dd><a href="{:url('admin/index/userinfo')}" target="mainfrm">基本资料</a></dd>
                            <dd><a href="{:url('admin/index/logout')}" target="_self">退出系统</a></dd>
                        </dl>
                    </li>
                </ul>
            </nav>
        </div>

        <div class="layui-side layui-bg-black">
            <div class="layui-side-scroll">
                <nav>
                    <ul class="layui-nav layui-nav-tree" id="sideNav" lay-filter="filter_sidenav">
                    </ul>
                </nav>
            </div>
        </div>
        <div class="layui-body">
            <!-- 内容主体区域 -->
            <iframe id="mainfrm" name="mainfrm" frameborder="0" class="layui-body-iframe" src="{:url('admin/index/main')}"></iframe>
        </div>

    </div>
<!--Recommended scripts position-->
<script type="text/javascript" src="__static__/layui/layui.js"></script>
<script type="text/javascript" src="__static__/js/admin.js"></script>

    <script>
        layui.use(['form','element'],function() {
            var form = layui.form;
            var element = layui.element;

            $.ajax({
                url:"{:url('admin/index/index')}",
                success:function(res){
                    var data = res.data;
                    var html = "";
                    for(var i=0;i<data.length;i++)
                    {
                        var module = data[i];
                        var haschild = module.children.length>0;
                        var href = "";
                        if(haschild){
                            href = "href='javascript:;'";
                        }else{
                            href = "href='javascript:;' lay-href='"+module.url+"'";
                            href = "href='"+module.url+"'";
                        }
                        html += '<li data-name="'+module.guid+'" class="layui-nav-item">';
                        html += '  <a '+href+' lay-tips="'+module.name+'" lay-direction="2">';
                        html += '    <i class="'+module.icon+'"></i>';
                        html += '    <cite>'+module.name+'</cite>';
                        html += '  </a>';
                        if(module.children.length>0)
                        {
                            html += $.renderchild(module.children);
                        }
                        html += '</li>';
                    }
                    $("#sideNav").html(html);
                    element.init();

                    element.on('nav(filter_sidenav)', function(elem){
                        var href = elem.attr('lay-href');
                        if(href == undefined)
                            return;
                        $("#mainfrm").attr('src',href);
                    });
                }
            });


            $.renderchild = function(childs,deepth=1){
                var html = "";
                html += '<dl class="layui-nav-child">';
                for(var i=0;i<childs.length;i++)
                {
                    var child = childs[i];
                    var haschild = child.children!=undefined && child.children.length>0;
                    var href = "";
                    if(haschild){
                        href = "href='javascript:;'";
                    }else{
                        href = "href='javascript:;' lay-href='"+child.url+"'";
                    }
                    html += '<dd data-name="'+child.guid+'" class="">';
                    html += '  <a '+href+' style="margin-left:'+deepth*15+'px;">';
                    html += '    <i class="'+child.icon+'"></i>';
                    html += child.name+'</a>';
                    if(child.children.length>0)
                        html += $.renderchild(child.children,deepth+1);
                    html += '</dd>';
                }
                html += '</dl>';
                return html;
            };

            $(".hideMenu").click(function(){
                $(documtent.body).toggleClass("layout-beta");
            });

            var winResize = function() {
                var docWidth = $(window).width();
                if (docWidth > 767) {
                    $("body").removeClass("layout-beta");
                } else {
                    $("body").addClass("layout-beta");
                }
            };
            winResize();

            //页面尺寸改变时，适应窗口大小
            $(window).on("resize", function () {
                window.setTimeout(function () {
                    winResize();
                }, 500);	//延迟执行,防止多次触发
            });

        });
    </script>

</body>
</html>